<template>
	<div>
		<navbar :config="config" backColor="rgba(0, 0, 0, 1)"></navbar>
		<div class="tips">
			<div class="box">
				<image src="../../logo.png" class="imgLogo"></image>
				<div class="text">
					欢迎您使用惠选中亿客户服务，为了保证服务质量，您的请求信息会被记录，有关个人信息处理的详情可参阅<a
						href="http://47.106.66.38:10040/policy.txt">《惠选中亿商城基本功能隐私政策》</a>
				</div>
				<div class="btn" @click="chart">
					开始聊天
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		checkOnline
	} from "../../api/personal-center.js"
	export default {
		data() {
			return {
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '',
					color: 'rgba(51, 51, 51, 1)',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#ffffff"],
					statusBarFontColor: '#1A1A1A',
					// backTabPage: '/pages/index/personal',
					backTabPage: ''
				},
				code: '',
				accid: '',
				state: ''
			}
		},
		methods: {
			async chart() {
				if (this.state == 200 && this.accid != null) {
					const id = 'p2p-' + this.accid;
					await uni.$UIKitStore.uiStore.selectSession(id);
					if (this.code != null && this.code != '') {
						uni.navigateTo({
							url: "/pages/imv9/index?id=" + this.code,
						});
					} else {
						uni.navigateTo({
							url: "/pages/imv9/index",
						});
					}
				} else {
					uni.showToast({
						title: '用户账号异常,请联系管理员',
						icon: 'error',
						duration: 2000
					});
					return false
				}
			},
			async checkOnline(shopId) {
				let res = await this.$http.post(checkOnline, {
					shopId: shopId
				})
				this.state = res.code
				if (res.code == 200) {
					this.config.title = res.data.accid;
					this.accid = res.data.accid;
				}
			}
		},
		onLoad(options) {
			if (options.shopId) {
				this.checkOnline(options.shopId);
			}
			if (options.id) {
				this.code = options.id
			}

		}
	}
</script>

<style lang="scss" scoped>
	a {
		color: rgba(255, 33, 31, 1);
		text-decoration: none;
	}

	.tips {
		width: 100%;
		height: calc(100vh - 90rpx);
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: rgba(249, 249, 249, 1);

		.box {
			height: 320rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			padding: 40rpx;
			margin: 0 20rpx;
			display: flex;
			flex-direction: column;
			justify-content: flex-end;
			position: relative;

			.text {
				font-weight: 400;
				font-size: 28rpx;
				color: #000000;
				line-height: 40rpx;
				text-align: justified;
				font-style: normal;
				text-transform: none;
			}

			.btn {
				height: 100rpx;
				line-height: 100rpx;
				margin-top: 40rpx;
				background: #FF211F;
				border-radius: 20rpx;
				font-weight: 400;
				font-size: 15px;
				color: #FFFFFF;
				text-align: center;
				font-style: normal;
			}

			.imgLogo {
				width: 81rpx;
				height: 81rpx;
				border-radius: 50%;
				position: absolute;
				top: -6%;
				right: 45%;
			}
		}
	}
</style>